import React from 'react';
import PropTypes from 'prop-types';

class TodoItem extends React.Component {
    // constructor在组建创建的第一时刻自动被执行
    constructor(props) {
        super(props);
        this.handleItemClick = this.handleItemClick.bind(this)
        this.PropTypes = {
            // content: PropTypes.string,
            content: PropTypes.oneOfType([
                PropTypes.string,
                PropTypes.number
            ]),
            deleteFunction: PropTypes.func,
            index: PropTypes.number,
            test: PropTypes.string.isRequired //父组件不传递值不会报错
        }

    }
    handleItemClick() {
        // 改变父组件的list数据
        // 子组件想要和父组件通信，它要调用父组件传递过来的方法
        const { deleteFunction, index } = this.props;
        deleteFunction(index);
    }
    render() {
        console.log('child render')
        // 子组件通过this.props的属性，从父组件接受传递过来的值
        const { test, content } = this.props;
        return (<li
            onClick={this.handleItemClick}>{test}-{content}</li>)
    }
    componentWillUnmount(){
        console.log('componentWillUnmount')
    }
}
// 不支持将defaultProps设置为TodoItem的实例属性，将被忽略。相反，在TodoItem上将defaultProps定义为静态属性。
TodoItem.defaultProps = {
    test: 'hello'
}
export default TodoItem;